import React, { PureComponent } from "react";
import { List, Button, notification } from "antd";
import Req from "../../common/Req";
export default class Message extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      messages: [
      ]
    };
  }

  loadDatas() {
    Req(
      "http://localhost:8080/order?orderState=paid_applying",
      {},
      this.props.history,
      resp => this.setState({ messages: resp.data })
    );
  }

  componentWillMount() {
    this.loadDatas();
  }

  render() {
    return (
      <div>
        <List
          header={<div>归还申请</div>}
          footer={<div>请严格按照《不平等条约》执行</div>}
          bordered
          dataSource={this.state.messages}
          renderItem={item => (
            <List.Item>
              <div
                style={{
                  width: "100%",
                  display: "flex",
                  flexDirection: "row",
                  justifyContent: "space-around"
                }}
              >
                <div>申请账号：{item.user.username}</div>
                <div>归还物品：{item.name}</div>
                <div>申请时间：{new Date(item.revertTime).toJSON()}</div>
                <div>
                  <Button
                    type="primary"
                    onClick={() => {
                      let params = { orderid: item.id };
                      //发起归还请求
                      Req(
                        "http://localhost:8080/order/confirmrevert",
                        {
                          method: "POST",
                          headers: {
                            "Content-type": "application/json"
                          },
                          body: JSON.stringify(params)
                        },
                        this.props.history,
                        resp => {
                          if (
                            resp.code === 100 &&
                            resp.data.status === "SUCCESS"
                          ) {
                            this.loadDatas();
                            notification["success"]({
                              message: "确认成功",
                              description: "已成功确认"
                            });
                          } else {
                            notification["error"]({
                              message: "确认失败",
                              description: "请稍后重试"
                            });
                          }
                        }
                      );
                    }}
                  >
                    确认归还
                  </Button>
                </div>
              </div>
            </List.Item>
          )}
        />
      </div>
    );
  }
}
